<template>
	<view class="container">
		<view class="content" v-if="courseExamInfo.examNotice">
			<mp-html :content='dealHtml(courseExamInfo.examNotice)'></mp-html>
		</view>
		<view class="bottom_btn">
			<view class="xjs-btn-primary" @tap="goExam(courseExamInfo.id)">立即考试</view>
		</view>
	</view>

</template>

<script lang="ts" setup>
	import { dealHtml } from '@/hooks/useFunction'
	import api from '@/api'
	import { ref } from 'vue'
	import { onLoad, onShow } from '@dcloudio/uni-app'
	const courseExamInfo = ref({})
	const examId = ref('')
	onLoad(async (options) => {
		examId.value = options.examId

	})
	onShow(async () => {
		await getCourseExamInfo(examId.value)
	})
	// 考试信息
	const getCourseExamInfo = async (id) => {
		const res : any = await api({
			method: 'get',
			url: `/mall/exam/info/${id}`
		})
		courseExamInfo.value = res.data || {}
	}
	const goExam = (id) => {
		courseExamInfo.examNotice = ''
		uni.redirectTo({
			url: `/pages/businessSchool/examProcess/index?id=${id}`
		})
	}
</script>

<style lang="scss" scoped>
	.container {
		background-color: #fff;
		min-height: 100vh;
		padding-bottom: calc(constant(safe-area-inset-bottom) + 100rpx);
		padding-bottom: calc(env(safe-area-inset-bottom) + 100rpx);
	}

	.content {
		padding: 32rpx;
	}

	.bottom_btn {
		position: fixed;
		bottom: 0;
		left: 0;
		padding: 8rpx 32rpx;
		padding-bottom: calc(constant(safe-area-inset-bottom) + 8rpx);
		padding-bottom: calc(env(safe-area-inset-bottom) + 8rpx);
		width: 100%;
		box-sizing: border-box;
		background-color: #fff;
		border-top: 1rpx solid #CCCCCC;

		/* view {
			width: 100%;
			height: 88rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			background: linear-gradient(90deg, #FF6188 0%, #FF5252 100%);
			border-radius: 62rpx;
			line-height: 1;
			font-size: 28rpx;
			color: #fff;
		} */
	}
</style>